<template>
  <div class="container">
    <nav-bar title="下架仓库">
      <!-- <span style="color: #333">
        <svg-icon icon-class="share" :width="15" :height="15" />
      </span> -->
    </nav-bar>

    <Item
      v-for="(item, idx) in purchaseList"
      :key="idx + 10"
      :is-show-step="true"
      :index="item.id"
      :num="item.goodsCount"
      :max-num="item.goodsCount"
      :min-number="item.goodsCount"
      :thumb="item.goodsImg"
      :sale-user="item.saleUserName"
      :buy-user="item.buyUserName"
      :title="item.goodsName"
      :price="(item.goodsPrice * item.goodsCount) | yuan"
      :is-checked="item.checked"
      :is-show-checkbox="type==1"
      :disabled="item.saleStatus==3"
      :time="item.addCardTime"
      tag-slot="warehouseTagSlot"
      class="warehouse-card"
      @input="handleItemSelect($event, 'purchase', idx, item.checked)"
    >
      <template name="warehouseTagSlot">
        <van-tag
          v-for="(item, idx) in !item.statusName ? [] : [item.statusName]"
          :key="idx"
          plain
          type="danger"
          style="margin-right: 4px"
          class="mt-12"
        >{{ item }}</van-tag>
      </template>
    </Item>
    <Tabbar :value="isOkList.length == purchaseList.length" v-if="purchaseList && purchaseList.length > 0 && type == 1" :normal-product="normalProduct" slot-name="warehouse" @pay="toPay">
    </Tabbar>
    
  </div>
</template>

<script>
import {
  checkAddReq,
  getCargoPrice,
  getRepositoryData,
  settleCart,
  updatePayAuditRefuse,
  updateWarehouseStatus,
  cgShelvesVerify
  
} from '@/api/cart'
import Item from '@/views/preOrder/modules/Item.vue'
import Tabbar from '@/views/preOrder/modules/Tabbar.vue'
import { updatePayment } from '@/api/cart'
import { base64uploadFile } from '@/api/upload'

export default {
  name: 'WarehouseIndex',
  components: {
    Item,
    Tabbar
  },
  data() {
    return {
      purchaseList: [],
      balance:'',
      title: '',
      recordOption: {},
      showPaymentVisible: false,
      productUrl: [],
      paymentPrice: 0,
      uploader: [],
      urls: '',
      showAuditVisible: false,
      timeFlag: false,
      paymentUrl: '',
      isOkList: [],
      type: 0,
      commissionPrice: 0,
      groundingGoodsPrice: 0,
      payPrice: 0,
      payUrl: '',
      commissionOrderPayNo:''
    }
  },
  computed: {
    normalProduct() {
      return this.isOkList[0]?.saleStatus === 3
    },
    checkedOption() {
      return this.purchaseList.find((item) => item.checked)
    },
  },
  mounted() {
    this.getData(3)
  },
  methods: {
    toPay() {
      if(this.isOkList.length>1){
        return this.$toast.fail('采购区商品一次仅能提一件商品')
      }
      this.$dialog.confirm({
        title: '确认去提货？'
      }).then(res => {
        if (res === 'confirm') {
          sessionStorage.setItem('takeGoods', JSON.stringify(this.isOkList))
          let ids = ''
          this.isOkList.forEach((item,index)=>{
            if(index+1!=this.isOkList.length){
              ids += item.id+','
            }else{
              ids += item.id
            }
          })
          console.log('ids',ids)
          this.$router.push({
            path: `/order/confirm?id=${ids}&type=2`
          })
        }
      })
      
    },
    getData: async function(type) {
      const res = await getRepositoryData({ type })
      console.log('仓库订单==', res)
      this.purchaseList = res.map.data.map((item) => {
        item.checked = false
        if (!item.saleStatus) {
          return item
        }
        let date =new Date(item.addCardTime)
        let y = date.getFullYear()
        let M = date.getMonth()>8 ?date.getMonth()+1 : '0'+(date.getMonth()+1)
        let d = date.getDate()>9 ? date.getDate(): '0'+date.getDate()
        let h = date.getHours()>9 ? date.getHours(): '0'+date.getHours()
        let m = date.getMinutes()>9 ? date.getMinutes(): '0'+date.getMinutes()
        let s = date.getSeconds()>9 ? date.getSeconds(): '0'+date.getSeconds()
        item.addCardTime = `${y}-${M}-${d} ${h}:${m}:${s}`
        return item
      })
      console.log(this.purchaseList)
    },
    async handleItemSelect(playload, type, index, checked) {
      // debugger
      console.log(playload, type, index, checked)
      const item = this.purchaseList[index]
      item.checked = !item.checked
      const indexs = this.isOkList.findIndex((item) => {
        return item.id === playload.idx
      })
      if (this.isOkList.length === 1) {
        this.isOkList = []
        if (playload.val) {
          this.$set(this.isOkList, this.isOkList.length, item)
        }
      } else {
        if (indexs !== -1) {
          this.isOkList.slice(0, indexs)
        } else {
          this.$set(this.isOkList, this.isOkList.length, item)
        }
      }
      console.log(this.isOkList)
      console.log(this.purchaseList)
      this.purchaseList.map((item) => {
        item.index = ''
        item.checked = false
      })
      this.purchaseList[index].index = index
      this.purchaseList[index].checked = !checked
      this.$set(this.purchaseList, index, this.purchaseList[index])
      this.recordOption = {}
      this.timeFlag = false
    },
  }
}
</script>

<style scoped lang="scss">
.container{
  // padding-bottom: 120px;
  min-height: 100vh;
}
.title-bar {
  width: 100%;
  text-align: center;
  font-size: 28px;
  font-weight: bolder;
  margin: 30px 0;
  overflow: hidden;
}

.warehouse-card {
  width: 100%;
  // background-color: #fff;
  box-sizing: border-box;
  overflow: hidden;

  ::v-deep .van-card{
    // width: 90%;
  }
  ::v-deep .van-card__title {
    font-size: 30px;
    font-weight: 600;
  }

  .mt-12 {
    margin-top: 12px;
  }

  ::v-deep .van-tag {
    line-height: 38px;
    font-weight: 600;
  }
}
</style>
